<template>
  <div class="exception-wrap">
    <bk-exception class="exception-wrap-item" type="404">
      <span>页面不存在</span>
      <div class="text-wrap">
        <span class="text-btn">刷新页面</span>
        <span class="text-btn" @click="back">返回首页</span>
      </div>
    </bk-exception>
  </div>
</template>

<script setup>
import { bkException } from "bk-magic-vue";
import { useRouter } from "@/router";
const router = useRouter();
const back = () => {
  // warning： Go to the node that has the permission
  router.push({ name: "Home" });
};
</script>

<style scoped lang="less">
.exception-wrap .exception-wrap-item {
  // border: 1px solid #dcdee5;
  margin: 10px;
  height: 420px;
  padding-top: 22px;
}
.exception-wrap .exception-wrap-item .text-wrap {
  display: flex;
  align-items: center;
  justify-content: center;
  color: #3a84ff;
  font-size: 14px;
  margin-top: 12px;
}
.text-wrap .text-btn {
  margin: 0 5px;
}
.text-wrap .text-btn:hover {
  cursor: pointer;
}
</style>
